<template>
  <header>
      <div id="1" class="nav-sort">
          <router-link tag="a" to="/home/classify/tab1" active-class="active"  href="#" >分类</router-link>
      </div>
      <div id="2" class="nav-sort">
          <router-link tag="a" to="/home/classify/tab2" active-class="active"  href="#">品牌</router-link>
          <img src="../../assets/img/search-icon.png" alt="">
      </div>
  </header>
</template>

<script>
export default {

}
</script>

<style lang="stylus" scoped>

header 
    display flex
    height 40px
    padding 0 15px
    width 100%
    border-bottom: 1px solid #cbcbcb;
    div.nav-sort 
        width 50%
        height 40px
        line-height .4rem
        a
            padding 0 .04rem
            text-align center
            font-size 13px
        a.active
            color: #41C856;
            border-bottom: 2px solid #41C856;
    div.nav-sort:first-child
        padding-right .1725rem
        a
            float right
            width .34rem
            height .4rem
    div.nav-sort:last-child
        position relative
        padding-left .1725rem
        img 
            position absolute 
            top: 13px;
            right: 15px;
            width: 14px;
            height: 14px;
            width .14rem
            height .14rem
            
        a
            float left
            width .34rem
            height .4rem
        


</style>